<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
#zhangsan{
    font-size: 40px;
    color:red;
}
#zhangsan>div{
    color:green;
}
#zhangsan>div>div{
    font-size: 40px;
    color: blueviolet;
}
/* 上面是 代代子孙 */
/* > 一代选择 */
#list span {
    color: aqua;
    font-size: 50px;
}
/* 空白 所有后代 */
</style>

<div id="zhangsan">
    张三
    <div>
        张三的儿子 <br>
        <span>
            张三的孙子 <br> 
        </span>
    </div>
</div>
<div id="list">
    <span>李四</span>
    <div>
        <span>李四的儿子</span> <br>
        <span>李四的曾孙</span>
</body>
</html>
</style>
<body>

</body>
</meta>
</head>
</html>